.page-home {
  blockquote {
    text-align:center;
    border:none;
    font-family: $font-headlines;
    color:lighten($color-base,15);
    margin:1.5em auto;

    p {
      font-size:1.5em;
      line-height:1.5em;
    }

    .main-content {
      h2 {
        text-align: center;
        color:$color-light;
      }
    }

  }

  footer {
    hr {
      margin-top:0;
      background:none;
      border:none;
    }
  }

  .main-content {
    text-align:center;
    padding:3em 0;

    h2 {
      text-align: center;
      padding:1em 0;
      color:lighten(#000,60%);
      position:relative;

      &:before {
        position:absolute;
        border:3px solid $color-base-light;
        width:10%;
        left:50%;
        margin-left:-5%;
        content:"";
        display:block;
        bottom:0;
      }
    }

    img {
      margin:1em 0;
    }

    h3 {
      color:$color-base-light;
    }

    p {
      color:lighten(#000,60%);
    }

    .vertical-align {
      margin-bottom:4em;
    }
  }
  
  #users-mask {
    color: #fff;
    background-color: #333;
    padding: 3em 0;
    text-align: center;
    
    .users {
      padding-bottom: 20px;
    }
  }
  
  #use-cases-mask {
    @include gradient-dkron;
    padding:3em 0;
    color:#fff;
    text-align: center;


    h2 {
      color:#fff;
      margin:0 0 1em 0;
    }

    span {
      display:block;
      margin-top:1.5em;
      font-size:.9em;
    }

    .container {
      text-align:center;
    }

    .case-container {
      //@include clearfix;
      display:inline-block;
      margin:0 auto;
      text-align: center;
      width:320px;
    }

    .case {
      margin-bottom:1em;
      float:left;
      display:block;
      margin:1em;
      width:120px;
    }
  }

  #products {
    width: 100%;
    margin: 0 auto;

    .comparison-chart {
      display: block;
      height: 100%;
      width: 100%;
      max-width: 800px;
      margin: 0 auto;
      padding: 10px 20px 20px;
      z-index: 1;
      box-shadow: 0 1px 2px rgba(0, 0, 0, 0.15);
      color: #999999;

      .products-table {
        font-size: .9em;
        color: #999999;

        .btn {
          border-radius: 6px;
        }
      }
    }
  }
}

.content {
  padding-bottom: 60px;
}

@media (min-width:$viewport-medium) {

  .page-home {

    #use-cases-mask {

      .case-container {
        width:480px;
      }

      .case {

        &:nth-child(4){
          clear:left;
        }
      }
    }

    .main-content {
      text-align:left;

      #features{
        text-align:center;
      }
    }

    .vertical-align {
      h3 {
        margin-top: 0em;
      }
      
      img {
        margin:0em;
        width: 60%;
      }
    }
  }
}

@media (min-width:$viewport-xlarge) {

  .page-home {
    blockquote {
      background:#eee;
      margin:4em 0;
      p {
        font-size:1.5em;
      }
    }

    .home-wrapper {
      background:lighten(#000,97%);
    }

    #use-cases-mask {

      .case-container {
        width:1000px;
      }

      .case {
        &:nth-child(4){
          clear:none;
        }
      }
    }

  }
  
}

